<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<meta name="viewport" content="width=1000, initial-scale=1.0, maximum-scale=1.0">
<!-- Loading Bootstrap -->
<link href="./Public/Admin/Flat/dist/css/vendor/bootstrap.min.css" rel="stylesheet">
<!-- Loading Flat UI -->
<link href="./Public/Admin/Flat/dist/css/flat-ui.css" rel="stylesheet">
<link href="./Public/Admin/Flat/docs/assets/css/demo.css" rel="stylesheet">
<script type="text/javascript" src="./Public/uploadify/jquery-1.8.2.min.js"></script>
<script type="text/javascript" src="./Public/uploadify/jquery.uploadify.min.js"></script>
<link rel="stylesheet" type="text/css" href="./Public/uploadify/uploadify.css">
<link rel="shortcut icon" href="./Public/Admin/Flat/img/favicon.ico">
		
<!--载入百度编辑器-->
<script type="text/javascript" charset="utf-8" src="Public/Admin/ueditor1_4_3/ueditor.config.js"></script>
<script type="text/javascript" charset="utf-8" src="Public/Admin/ueditor1_4_3/ueditor.all.min.js"> </script>
<script type="text/javascript" charset="utf-8" src="Public/Admin/ueditor1_4_3/lang/zh-cn/zh-cn.js"></script>

<script>
	$(function(){
			$('select[name=category_cid]').change(function(){
				//获得选中的option的tid
//				alert(1);
				var tid = $('option:selected').attr('type_tid');
				console.log(tid);
				$.ajax({
					type:"post",
					url:"<?php echo U('Goods/getAttr')?>",
					data:{t : tid},
					//确定返回数据类型
					dataType:'json',
					success:function(phpData){
						console.log(phpData);
						var attr = '';
						var spec = '';
						$.each(phpData, function(k,v) {    
							//如果是属性
							if(v.class == 0){
								attr += '<tr class="info">';
								attr += '<td>'+v.taname+'</td>';
								attr += '<td>';
								attr += '<select name="attr['+v.taid+']" id="">';
								attr += '<option value="">请选择</option>';
									 $.each(v.tavalue, function(kk,vv) {    
										attr += '<option value="'+vv+'">'+vv+'</option>';
									 });
								attr += '</select>';
								attr += '</td></tr>';
								
							}else{//如果是规格
								spec += '<tr class="info">';
								spec += '<td>'+v.taname+'</td>';
								spec += '<td>';
								spec += '<select name="spec[value]['+v.taid+'][]" id="">';
								spec += '<option value="">请选择</option>';
									$.each(v.tavalue, function(kk,vv) {    
										spec += '<option value="'+vv+'">'+vv+'</option>';                                                          
									});
								spec += '</select></td>';
								spec += '<td>附加价格：<input type="text" name="spec[added]['+v.taid+'][]" id=""/></td>';
								spec += '<td>';
								spec += '<a href="javascript:;" class="btn btn-primary addSpec">添加规格</a>';
								spec += '</td></tr>';
							}
							                                                        
						});
						
						$('#attr').html(attr);
						$('#spec').html(spec);
					}
				});
			})
			//点击添加规格
			$('.addSpec').live('click',function(){
				//找到当前的父级的tr
				var trObj = $(this).parents('tr');
				//克隆一个
				var tr = trObj.clone();
				tr.find('.addSpec').html('删除规格').removeClass('btn-primary addSpec').addClass('btn-info removeSpec');
				//再插入到当前父级的下面
				trObj.after(tr);
				
			})
			$('.removeSpec').live('click',function(){
				$(this).parents('tr').remove();
			})
		})
</script>

</head>
<body>
<form action="" method="post" enctype="multipart/form-data">
	<div class="alert alert-success">添加商品</div>
	
	<div class="alert alert-success" style="width: 200px;">基本信息</div>
	
	<div class="form-group">
		<label for="exampleInputEmail1">所属分类</label>
		<select id="c" name="category_cid" class="form-control" >
			<option value="">请选择</option>
			<?php foreach ($cateData as $v){?>
			<option value="<?php echo $v['cid']?>" type_tid=<?php echo $v['type_tid']?>><?php echo $v['cname']?></option>
			<?php }?>
		</select>
	</div>
	
	<div class="form-group">
		<label for="exampleInputEmail1">所属品牌</label>
		<select name="brand_bid" class="form-control">
			<option value="">请选择</option>
			<?php foreach ($brandData as $v){?>
			<option value="<?php echo $v['bid']?>"><?php echo $v['bname']?></option>
			<?php }?>
		</select>
	</div>
	
	<div class="form-group">
		<label for="exampleInputEmail1">商品名称</label>
		<input id="exampleInputEmail1" class="form-control" type="text" placeholder="请输入商品名称"  name="gname" value="">
	</div>
	
	<div class="form-group">
		<label for="exampleInputEmail1">总库存</label>
		<input id="exampleInputEmail1" class="form-control" type="text" placeholder="请输入商品库存"  name="stock" value="">
	</div>
	
	<div class="form-group">
		<label for="exampleInputEmail1">单位</label>
		<input id="exampleInputEmail1" class="form-control" type="text" placeholder="请输入单位名称"  name="company" value="件">
	</div>
	
	<div class="form-group">
		<label for="exampleInputEmail1">市场价</label>
		<input id="exampleInputEmail1" class="form-control" type="text" placeholder="请输入市场价格"  name="marketprice" value="">
	</div>
	
	<div class="form-group">
		<label for="exampleInputEmail1">商城价</label>
		<input id="exampleInputEmail1" class="form-control" type="text" placeholder="请输入商城价格"  name="shopprice" value="">
	</div>
	
	<div class="form-group">
		<label for="exampleInputEmail1">商品货号</label>
		<input id="exampleInputEmail1" class="form-control" type="text" placeholder="请输入商品货号"  name="gmodel" value="">
	</div>
	
	<p class="btn btn-primary">商品属性</p>
		<table class="table table-bordered table-hover" id='attr' class="info">
			
			
		</table>
	<p class="btn btn-primary">商品规格</p>
		<table class="table table-bordered table-hover" id='spec'>
			
		</table>
		
	
	<div class="alert alert-success">列表图
		<!-- html页面 -->
		<div lab="uploadFile">
		<!-- file表单 -->
   		<input id="d" type="file" multiple="true">
		<!--<span>类型: *.jpg,*.png 大小: 2000KB 数量: 10</span>-->
		<script type="text/javascript">
    		$(function() {
	        	$('#d').uploadify({
	            	'formData'     : {//POST数据
	                	'<?php echo session_name();?>' : '<?php echo session_id();?>',
	            	},
	            	'fileTypeExts' : '*.jpg;*.png',
	            	'swf'      : '<?php echo __PUBLIC__?>/uploadify/uploadify.swf',
	            	'uploader' : '<?php echo U('upload')?>',//指定服务器上传的方法
	            	'buttonText':'选择文件',
	            	'fileSize' : '2000KB',
	            	'uploadLimit' : 10,//上传文件数
	            	'width':65,
	            	'height':25,
	            	'successTimeout':10,//等待服务器响应时间
	            	'removeTimeout' : 0.2,//成功显示时间
	            	'onUploadSuccess' : function(file, data, response) {
	                	//把php返回的数据转为json
	                	data=$.parseJSON(data);
	                	//获得图片地址
	                	var imageUrl = data.url;
	                	var li="<li>";
	                	li += "<img src='"+imageUrl+"'/>";
	                	li += "<input type='hidden' name='pic' value='"+data.path+"'/><a href='javascript:;' id='self-close'>X</a>";
	                	li += "</li>";
	                	$("#uploadLists ul").prepend(li);
	            	}
	        	});
				//关闭图片
	        	var i = 1;
	        	$('#self-close').live('click',function(){
	            	$(this).parent('li').remove();
	            	i++;
	            	$('#d').uploadify('settings','upload',i);
	        	})
    		});
		</script>
		<div id="uploadLists">
    		<ul>

    		</ul>
		</div>
	</div>
</div>

	<div class="alert alert-success">商品图
		<!-- html页面 -->
		<div lab="uploadFile">
		<!-- file表单 -->
   	 	<input id="f" type="file" multiple="true">
    	<!--<span>类型: *.jpg,*.png 大小: 2000KB 数量: 10</span>-->
    	<script type="text/javascript">
        	$(function() {
	            $('#f').uploadify({
	                'formData'     : {//POST数据
	                    '<?php echo session_name();?>' : '<?php echo session_id();?>',
	                },
	                'fileTypeExts' : '*.jpg;*.png',
	                'swf'      : '<?php echo __PUBLIC__?>/uploadify/uploadify.swf',
	                'uploader' : '<?php echo U('upload')?>',//指定服务器上传的方法
	                'buttonText':'选择文件',
	                'fileSizeLimit' : '2000KB',
	                'uploadLimit' : 10,//上传文件数
	                'width':65,
	                'height':25,
	                'successTimeout':10,//等待服务器响应时间
	                'removeTimeout' : 0.2,//成功显示时间
	                'onUploadSuccess' : function(file, data, response) {
	                    //把php返回的数据转为json
	                    data=$.parseJSON(data);
	                    //获得图片地址
	                    var imageUrl = data.url;
	                    var li="<li>";
	                    li += "<img src='"+imageUrl+"'/>";
	                    li += "<input type='hidden' name='thumb' value='"+data.path+"'/><a href='javascript:;' id='self-close'>X</a>";
	                    li += "</li>";
	                    $("#uploadList ul").prepend(li);
	                }
	            });
	
				//关闭图片
	            var i = 1;
	            $('#self-close').live('click',function(){
	                $(this).parent('li').remove();
	                i++;
	                $('#f').uploadify('settings','upload',i);
	            })
	        });
	    </script>
    	<div id="uploadList">
       		<ul>

        	</ul>
    	</div>
	</div>
</div>

	<div class="form-group">
		<label for="exampleInputEmail1">商品详情</label>
		<!--调用百度编辑器-->
		<script id="editor" type="text/plain" style="width:100%;height:500px;" name="content"></script>
		   <script>
		       var ue = UE.getEditor('editor');
		   </script>
	</div>

		<button class="btn btn-primary btn-block" type="submit"> 确定 </button>
		</form>
	</body>
</html>
